<%-- 
    Document   : index
    Created on : 17 Apr 12, 13:16:25
    Author     : Edgar Drake
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<jsp:useBean id="lis" class="main.LogicImageSegmentation" scope="application"/>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Image Segmentation</title>
        <link href="css/style.css" type="text/css" rel="stylesheet">
        <script type="text/javascript" src="js/jQuery.js"></script>
        <script type="text/javascript" src="js/scripts.js"></script>
        <script type="text/javascript" src="js/ajax.js"></script>
    </head>
    <body>
        <div class="main">
            <!--------------------- HEADER --------------------->
            <div class="header">
                <a class="title button inline right" href="classify.jsp"  >Classify</a>
            </div>
            <!---------------------- BODY ---------------------->
            <div class="body">
                <div class="uploader box inline">
                    <div class="title">Upload Training Dataset</div>
                    <form id="uploadform" method="POST" action="uploadTraining.jsp" enctype="multipart/form-data">
                        <div class="">Input File .arff</div>
                        <div class="inline browser"><input id="file-browser" type="file" name="input_file" ></div>
                        <div class="inline browser"><input id="submit" onclick="upload()" type="submit" name="" value="OK"></div>
                        <div class="inline browser"><a href="src/java/data_set/image_segmentation_data.arff" target="_blank">download arff</a></div>
                        <div class="inline browser"><a href="src/java/data_set/image_segmentation_data.csv" target="_blank">download csv</a></div>
                    </form>
                    <!--status upload-->
                    <div id="status"></div>
                </div>                
                <form action="" method="post" name="filters" class="inline">
                    <div class="attribs box inline">
                        <div class="title">Training Attributes</div>
                        <div class="attributes">
                            <ul>
                                <!--li><input type="checkbox" name="" value="a0">classes</li-->
                                <li><input type="checkbox" name="attr" value="a1" checked="checked">region-centroid-col</input><input class="right" type="radio" name="show" value="0" checked="checked" ></input></li>
                                <li><input type="checkbox" name="attr" value="a2" checked="checked">region-centroid-row</input><input class="right" type="radio" name="show" value="1" ></input></li>
                                <li><input type="checkbox" name="attr" value="a3" checked="checked">region-pixel-count</input><input class="right" type="radio" name="show" value="2" ></input></li>
                                <li><input type="checkbox" name="attr" value="a4" checked="checked">short-line-density-5</input><input class="right" type="radio" name="show" value="3" ></input></li>
                                <li><input type="checkbox" name="attr" value="a5" checked="checked">short-line-density-2</input><input class="right" type="radio" name="show" value="4" ></input></li>
                                <li><input type="checkbox" name="attr" value="a6" checked="checked">vedge-mean</input><input class="right" type="radio" name="show" value="5" ></input></li>
                                <li><input type="checkbox" name="attr" value="a7" checked="checked">vegde-sd</input><input class="right" type="radio" name="show" value="6" ></input></li>
                                <li><input type="checkbox" name="attr" value="a8" checked="checked">hedge-mean</input><input class="right" type="radio" name="show" value="7" ></input></li>
                                <li><input type="checkbox" name="attr" value="a9" checked="checked">hedge-sd</input><input class="right" type="radio" name="show" value="8" ></input></li>
                                <li><input type="checkbox" name="attr" value="a10" checked="checked">intensity-mean</input><input class="right" type="radio" name="show" value="9" ></input></li>
                                <li><input type="checkbox" name="attr" value="a11" checked="checked">rawred-mean</input><input class="right" type="radio" name="show" value="10" ></input></li>
                                <li><input type="checkbox" name="attr" value="a12" checked="checked">rawblue-mean</input><input class="right" type="radio" name="show" value="11" ></input></li>
                                <li><input type="checkbox" name="attr" value="a13" checked="checked">rawgreen-mean</input><input class="right" type="radio" name="show" value="12" ></input></li>
                                <li><input type="checkbox" name="attr" value="a14" checked="checked">exred-mean</input><input class="right" type="radio" name="show" value="13" ></input></li>
                                <li><input type="checkbox" name="attr" value="a15" checked="checked">exblue-mean</input><input class="right" type="radio" name="show" value="14" ></input></li>
                                <li><input type="checkbox" name="attr" value="a16" checked="checked">exgreen-mean</input><input class="right" type="radio" name="show" value="15" ></input></li>
                                <li><input type="checkbox" name="attr" value="a17" checked="checked">value-mean</input><input class="right" type="radio" name="show" value="16" ></input></li>
                                <li><input type="checkbox" name="attr" value="a18" checked="checked">saturation-mean</input><input class="right" type="radio" name="show" value="17" ></input></li>
                                <li><input type="checkbox" name="attr" value="a19" checked="checked">hue-mean</input><input class="right" type="radio" name="show" value="18" ></input></li>                                
                                <li><input type="checkbox" name="attr" value="a20" checked="checked">OBJECT (class)</input><input class="right" type="radio" name="show" value="19" ></input></li>
                            </ul>
                        </div>
                        <div class="button inline" onclick="selectAttrAll()">all</div>
                        <div class="button inline" onclick="deselectAttrAll()">none</div>
                        <div class="button inline" onclick="showDistributionDataGraph()">Show Dist Data Graph</div>
                    </div>
                    <div class="inline">
                        <div>
                            <div class="preprocess box inline">
                                <div class="title">Preprocessing</div>
                                <ul>
                                    <li><input type="radio" name="preprocess" value="0" checked="checked">discretize</li>
                                    <li><input type="radio" name="preprocess" value="1">normalize attributes</li>
                                    <li><input type="radio" name="preprocess" value="2">replace missing value</li>
                                    <li><input type="radio" name="preprocess" value="3">attributes selection</li>
                                    <li><input type="radio" name="preprocess" value="4">manual selection</li>
                                </ul>                                
                                <div class="button inline" onclick="applyFilter()">Apply</div>                                
                                <div class="inline" id="preprocessstatus" ></div>
                            </div>
                            <div class="params box inline" id="params">
                                <div class="title">Learn?</div>
                                <div class="big-button inline" onclick="doLearn()">
                                    START LEARNING NOW!
                                </div>
                            </div>
                        </div>
                    </div>


                </form>
                <div>
                    <div class="inline">
                        <div id="testing" class="box">
                            <div class="title">Testing Method</div>
                            <ul>
                                <li id="k-id3" onclick="setRadioActive(0,'testing'); closeParams()">&Implies;<input type="radio" name="testing" value="1" checked="checked">Use Training Set</li>
                                <li id="k-knn" onclick="setRadioActive(1,'testing'); showParams(1)">&Implies;<input type="radio" name="testing" value="2">Supplied Data Test</li>
                                <li id="k-nby" onclick="setRadioActive(2,'testing'); showParams(2)">&Implies;<input type="radio" name="testing" value="3">Cross Validation</li>
                                <li id="k-nby" onclick="setRadioActive(3,'testing'); showParams(3)">&Implies;<input type="radio" name="testing" value="4">Percentage Split</li>
                            </ul>
                        </div>
                        <div class="box" id="parameters"></div>                        
                    </div>                    
                     <div class="inline">
                        <div class="box" id="log">
                            <div class="title">Log</div>
                            <div class="history"></div>
                        </div>                        
                    </div>
                </div>
            </div>
            <!--------------------- FOOTER --------------------->
            <div class="footer">
                <!-- invisible upload -->
                <iframe id ="target-iframe" name="target-iframe" hidden="hidden" ></iframe>
            </div>
            <!-------------------------------------------------->
        </div>
    </body>
</html>
